<!--
 * @Author: zhuxiaoyi
 * @Date: 2024-01-09 10:50:36
 * @LastEditor: zhuxiaoyi
 * @LastEditTime: 2025-02-07 09:59:23
 * @Description: 
-->
<template>
    <el-dialog :modelValue="props.addToTypeDia.visible" title="添加流程" center :before-close="closeDialogHandler"
        @open="dialogOpenHandler" width="1050px">
        <el-row>
            <el-col :span="24">
                <el-table ref="" :height="view.height - 490" :data="tableData" style="width: 100%" highlight-current-row
                    :border="true" @selection-change="handleSelectionChange">
                    <el-table-column type="selection" width="55" />
                    <el-table-column :align="'center'" type="index" width="50" />
                    <el-table-column :align="'left'" property="name" label="名称" show-overflow-tooltip>
                        <template #default="scope">
                            {{ scope.row.name }}
                        </template>
                    </el-table-column>
                    <el-table-column :align="'left'" label="描述" show-overflow-tooltip>
                        <template #default="scope">
                            {{ scope.row.desc }}
                        </template>
                    </el-table-column>
                    <el-table-column :align="'center'" label="日期" width="180">
                        <template #default="scope">
                            <span>
                                {{ utils.formatDate(scope.row.createDate) }}
                            </span>
                        </template>
                    </el-table-column>
                    <!-- <el-table-column :align="'center'" property="type" label="类型" width="100">
                        <template #default="scope">
                            <el-tag>{{ scope.row.type }}</el-tag>
                        </template>
                    </el-table-column> -->
                </el-table>
            </el-col>
        </el-row>
        <template #footer>
            <div style=" width: 100%; display: flex;justify-content: center;">
                <el-button size="small" type="primary" @click="submitForm()">
                    确定
                </el-button>
                <el-button size="small" @click="resetForm()">取消</el-button>
            </div>
        </template>
    </el-dialog>
</template>
<script setup lang="ts">
import { defineComponent, reactive, ref, toRefs, onMounted, watch } from "vue";
import HttpService from '@/api/api'
import utils from "@/utils/util";
// import * as _ from "lodash";
import { ElMessage, ElMessageBox } from "element-plus";


let tableData = ref([])
let tableLoading = ref(false)
let chooseData = ref([])
let submitData = reactive({
    processes: [],
    type: ""
})
const emits = defineEmits(['dialogSubmit', 'closeAddProcessDialog']);
onMounted(() => {

});

const props = defineProps({
    addToTypeDia: Object
});

var view = reactive({
    height: window.innerHeight,
});

const closeDialogHandler = function () {
    emits('closeAddProcessDialog')
}

const dialogOpenHandler = function () {
    submitData.type = props.addToTypeDia.id
    getprocessList()
}

const submitForm = function () {
    submitData.processes.length = 0
    chooseData.value.forEach(item => {
        submitData.processes.push(item.id)
    })
    if (submitData.processes.length < 1) {
        ElMessage({
            message: "至少选择一个流程",
            type: "warning",
        });
    }else{
        emits('dialogSubmit',submitData)
        emits('closeAddProcessDialog')
    }
}

const resetForm = function () {
    closeDialogHandler()
}

const getprocessList = function () {
    let params = {
        page_size: 1000,
        page_index: 1,
        keyword: ''
    };
    tableData.value.length = 0;
    tableLoading.value = true
    HttpService.processListManage.getprocessList(
        params,
        (res) => {
            if (res.status == 200) {
                res.data.data.map((item, index) => {
                    if (!item.type) {
                        tableData.value.push(item);
                    }
                });
                tableLoading.value = false
            } else {
                console.log("获取信息失败" + res);
                tableLoading.value = false
            }
        },
        (error) => {
            console.log(error);
            tableLoading.value = false
        }
    );
};

const handleSelectionChange = (val) => {
    chooseData.value = val
    console.log(chooseData.value)
}

</script>
<style lang="scss" scoped></style>
<style lang="scss"></style>